<template>
    <div class="wrapper">
      <div class="head-all" > <cm-header id="40"></cm-header> </div>

      <div class="minWidth">
       <div class="top-position "> 当前位置： <span @click="def_getBack">成果内容</span>> <span>{{adress}}</span></div>
        <!--内容展示-->
        <div class="bigWrapper flex" v-show="bigDataShow">
          <!--左侧内容开始-->
        <div class="flexLeft contentLeft ">
          <div class="bgWhite">
            <div class=" refreshWrapper ">
              <home-refresh :titleRefresh="refreshKey"></home-refresh>
            </div>
            <div >
              <!--最新入库图文列表组件-->
              <warehouse :newList="newList" isFather="isDetail"></warehouse>
            </div>
          </div>
          <div class="bgWhite mt10px">
            <div class=" refreshWrapper ">
              <home-refresh :titleRefresh="refreshKey2"></home-refresh>
            </div>
            <div class="keywordList">
              <!--热门关键词-->
              <home-hot-keyword :keywordList="allData.kwList"></home-hot-keyword>
            </div>
          </div>
          <div class="bgWhite mt10px eyesWrapper">
            <div class="eyes-title flex"><img src="../../assets/commonImg/renmen.png" alt=""> 谁收藏过  <span style="margin-left: 5px"> ({{allData.CollectNumber}})</span></div>
            <div>
              <!--浏览记录组件-->
              <home-eyes :eyesList="allData.CollectList"></home-eyes>
            </div>
          </div>
        </div>
          <!--左侧内容结束-->
          <!--右侧内容开始-->
        <div class="flex1 contentRight  " style="width: 900px">
          <!--成果概况-->
          <div class="bgWhite">
            <detail-title :mobanList="mobanList" goWhere="topButton" @do_showDetail="do_showDetail($event)"></detail-title>
            <result-top :allData="allData" ref="closeMore"></result-top>
          </div>
          <!--成果-->
          <div class="bgWhite mt10px">
            <!--<detail-title :mobanList="cgList" ></detail-title>-->
            <div class="f-bian selectNav ">
              <div class="headText flex">
                <span @click="do_selectNav(index)" class="flex200 upNav" v-for="(item,index) in upLoad" :key="index" v-text="item" :id="index==upNavIndex?'currentNav':''">上传论文</span>
              </div>
              <div class="xiazai-text f" >
                <div class="fullScreen" @click="do_fullScreen(selectNavData[upNavIndex].LUrl)"><img src="../../assets/commonImg/fullScreen2019-10-12.png" alt="">全屏查看</div>
                <div @click="do_downLoad(selectNavData[upNavIndex].FileSN)"><span class="iconfont icon-xiazai"></span> 下载（{{allData.DownNumber}}）</div>
              </div>
            </div>

            <div class="cgContent" v-for="(item2,index2) in selectNavData" :key="index2" v-if="item2.first" v-show="index2===upNavIndex">
              <iframe class= "iFrameHomePage" scrolling='none' :src= "item2.LUrl" style="width:100%;height: 660px;border: none"  ></iframe>
            </div>
          </div>
          <!--附件-->
          <div class="bgWhite mt10px ">
            <detail-title :mobanList="fujianList" goWhere="fujian" @do_showDetail="do_showDetail($event)"></detail-title>
            <div class="pdtb10px">  <deatailAttach :attachmentList="attachmentList"></deatailAttach></div>

          </div>
          <!--应用情况-->
          <div class="bgWhite mt10px" v-if="allData.ResultModel&&allData.ResultModel.indexOf('研究成果')>=0" >
            <detail-title :mobanList="useList" goWhere="yingYong" @do_showDetail="do_showDetail($event)"></detail-title>
            <div class="pdtb10px mt5px">
              <detai-use-info :useData="useData"></detai-use-info>
            </div>

          </div>
          <!--评论-->
          <div class="bgWhite mt10px">
            <detail-title :mobanList="ratList" goWhere="myRat" @do_showDetail="do_showDetail($event)"></detail-title>
            <detail-myRat :ratDataList="ratDataList"></detail-myRat>
          </div>
          <div class="bgWhite mt10px">
            <detail-title :mobanList="ratListLeft"></detail-title>
            <rat-texarea :myRatData="myRatData" ></rat-texarea>
          </div>
        </div>
          <!--右侧内容结束-->
        </div>

        <!--&lt;!&ndash;顶部进入详情成果概况&ndash;&gt;-->
        <!--<div v-show="adressDetail[0]">-->
          <!--<div class="bgWhite mt10px ">-->
          <!--<detail-title :mobanList="mobanListDetail" ></detail-title>-->
            <!--<top-detail :allData="allData"></top-detail>-->
          <!--</div>-->
        <!--</div>-->
        <!--附件进入详情-->
        <div v-show="adressDetail[1]">
          <div class="bgWhite mt10px ">
            <detail-title :mobanList="fujianListDetail" goWhere="fujian" @do_showDetail="do_showDetail($event)"></detail-title>
            <div class="pdtb10px">  <deatailAttach :attachmentList="attachmentListDetail"></deatailAttach></div>
          </div>
        </div>
        <!--引用中心进入详情-->
        <div v-show="adressDetail[2]">

          <div class="bgWhite mt10px">
            <detail-title :mobanList="useListDetail" goWhere="yingYong" @do_showDetail="do_showDetail($event)"></detail-title>
            <div class="pdtb10px mt5px">
              <detai-useInfo :useData="useDataDetail"></detai-useInfo>
            </div>

          </div>
        </div>
        <!--我要评价进入详情-->
        <div v-show="adressDetail[3]">
          <doSelect @do_query="do_query($event)" :navSearchList="navSearchList"></doSelect> <!--详情评价搜索组件-->
          <div class="bgWhite mt10px">
            <detail-title :mobanList="ratListDetail" goWhere="myRat" @do_showDetail="do_showDetail($event)"></detail-title> <!--详情评价头部-->
            <div class="ratWrap">
              <detail-myRat v-if="ratDataList2.length>=1" :ratDataList="ratDataList2"></detail-myRat>  <!--详情评价列表-->
              <noData v-if="ratDataList2.length<1"></noData>
            </div>
          </div>
          <doPage @getCurPage="getCurPage($event)" :pages="ratPages"></doPage>
          <div class="bgWhite mt10px" v-show="ratShow[0]">
            <rat-texarea :myRatData="myRatData" ></rat-texarea>
          </div>
        </div>
      </div>
    </div>
</template>

<script>
  import cmHeader from '../common/cm_header'
  import homeRefresh from '../common/cm_home-refresh'//热门刷新小组件
  import warehouse from '../cgkHome/latestWarehousing'
  import homeHotKeyword from '../common/cm_home-hotKeyword'//热度关键词
  import homeEyes from '../common/cm_home-eyes2'//浏览记录
  import detailTitle from '../common/cm_detail-title'//右侧每条信息顶部小组件
  import resultTop from './detail-result-top'//右侧d顶部成果概况
  import deatailAttach from './detail-attach'//右侧附件
  import detaiUseInfo from './detail-useInfo'//应用中心
  import detailMyRat from './detail-myRat'//评论
  import ratTexarea from './detail-ratTexarea'//评论
  // import topDetail from './detail-result-top-detail'//右侧顶部详情
  import doSelect from '../common/cm_doSelect'//右侧顶部详情
  import doPage from '../common/cm_doPage'  //分页
  import noData from '../common/cmNodata_model'  //没查询到数据
    export default {
        name: "subjectDetail",
      inject:['reload'],
      components:{
        cmHeader,
        homeRefresh,
        warehouse,
        homeHotKeyword,
        homeEyes,
        detailTitle,
        resultTop,
        deatailAttach,
        detaiUseInfo,
        detailMyRat,
        ratTexarea,
        // topDetail,
        doSelect,
        doPage,
        noData

      },
      data(){
          return{

            upNavIndex:0,
            upLoad:["全文","成果背景","成果内容","成果创新","成果效果","问题与思考"],
            adressDetail:[false,false,false,false,false,false],
            ratShow:[false,false],
            adress:'查看课题',
            bigDataShow:true,
            refreshKey: {
              name: "相关推荐",
              nameSrc: this.$ZcPublic.Domain + "static/img/common/xiangguan201978.png",
              doText: "换一批",
              textSrc: this.$ZcPublic.Domain + "static/img/common/huan2019627.png",
            },
            refreshKey2: {
              name: "热门关键词",
              nameSrc: this.$ZcPublic.Domain + "static/img/common/xiangguan201978.png",
              doText: "换一批",
              textSrc: this.$ZcPublic.Domain + "static/img/common/huan2019627.png",
            },
            newList:[

            ],
            isDetail:'isDetail',//判断是详情页面调用子组件


            mobanList:{
              iconLeft:'wenjian',
              titleLeft:'成果概况',
              // contentNum:3,
              // titleMidl:'xxx标题',
              //btn:'查看详情',
              // iconDown:"xiazai",
              // iconText:"下载",
              // color:'blue'
              // goNext:'进入详情',
              // iconRight:'shuangyoujiantou-'
            },
            mobanListDetail:{iconLeft:'xiugaishijian-copy', titleLeft:'详情信息',  titleMidl:'xxx标题'},//进入成果概况后的顶部
            // cgList:{iconLeft:'xiugaishijian-copy', titleLeft:'成果', iconDown:"xiazai",iconText:"下载",},
            fujianList:{iconLeft:'pin2biezhen', titleLeft:'附件', contentNum:3,  goNext:'进入详情',iconRight:'shuangyoujiantou-'},
            fujianListDetail:{iconLeft:'pin2biezhen', titleLeft:'附件查看', contentNum:3},
            ratList:{iconLeft:'xinxi', titleLeft:'评论信息', contentNum:3,  goNext:'进入详情',iconRight:'shuangyoujiantou-'},
            ratList2:{iconLeft:'xinxi', titleLeft:'互动交流', contentNum:3,  goNext:'进入详情',iconRight:'shuangyoujiantou-'},
            ratListDetail:{iconLeft:'xinxi', titleLeft:'评论信息', contentNum:3,SN:""},
            changeListDetail:{iconLeft:'xinxi', titleLeft:'评论信息', contentNum:3, iconDown:"xiugaishijian-copy",iconText:"我要提问",color:"blue"},
            useList:{iconLeft:'yingyong', titleLeft:'应用情况', contentNum:5,  goNext:'进入详情',iconRight:'shuangyoujiantou-'},//应用中心
            useListDetail:{iconLeft:'yingyong', titleLeft:'应用情况', contentNum:5 },//进入应用中心
            ratListLeft:{iconLeft:'xiugaishijian-copy', titleLeft:'发表评价'},
            attachmentList:[
              {FileName:'斯蒂芬多少2',FileType:'word'}
            ],//附件
            attachmentListDetail:[
              {FileName:'斯蒂芬多少',FileType:'word'}
            ],//进入附件展示

            useData:[
              {time:"2019-8-9",title:'发动反攻的论文标题',useType:'教师应用',person:'张三'},
              {time:"2019-8-9",title:'发动反攻的论文标题',useType:'教师应用',person:'张三'},
            ],//应用中心
            useDataDetail:[
              {time:"2019-8-9",title:'发动反攻的论文标题',useType:'教师应用',person:'张三'}
            ],//进入应用中心
            ratDataList:[
              {name:'展示',date:"2019/8/7",rat:"风口呢可能风口呢可能风口呢可能风口呢可能风口呢可能",score:'3',starShow:true}
            ],
            ratDataList2:[
              {name:'展示',date:"2019/8/7",rat:"风口呢可能风口呢可能风口呢可能风口呢可能风口呢可能",score:'3',starShow:false}
            ],
            myRatData:{placeholder:'请写下对该作品的宝贵意见',starShow:true,SN:''},
            myRatData2:{placeholder:'请写下对该作品的宝贵意见',starShow:false},
            SN:'',            //本成果SN
            allData:{},       //本成果数据
            selectNavData:[],
            ratQueryStr:{PageNum:10,QueryKeyModel:'评价内容',QueryKey:"",IsDesc:true},   //评论查询条件
            ratPage:1,        //第一页评论
            ratPages:0,   //总分页数
            navSearchList:["评价内容","评价人"],
            // keyShowList:[]  //热门关键词组件数据
            FileSN:''  //下载SN
          }
      },
      created(){
          this.SN=this.$route.query.SN
        this.do_getData()
      },
      methods:{
          do_getData(){
            let me = this;
            me.$ZcPublic.zcServer.Post({
              IsNeedLogin: 'false',
              Paras: {
                Name: 'Vue_resultLib',
                action: "getResultShowShow",
                Data: {
                  SN:me.SN
                }
              },
              Callback: me.cb_getData,
              Scope: me,
            });
          },
        cb_getData(resJson,scope){
            console.log("单个成果详情",resJson)
          if(resJson.success){
             this.allData=resJson.data
             this.selectNavData[0]=this.allData.File;
             this.selectNavData[0].first=true;
             this.selectNavData[1]=this.allData.File1;
             this.selectNavData[1].first=false;
             this.selectNavData[2]=this.allData.File2;
             this.selectNavData[2].first=false;
             this.selectNavData[3]=this.allData.File3;
             this.selectNavData[3].first=false;
             this.selectNavData[4]=this.allData.File4;
             this.selectNavData[4].first=false;
             this.selectNavData[5]=this.allData.File5;
             this.selectNavData[5].first=false;
             this.fujianList.contentNum=resJson.data.ComAttNumber
             this.mobanListDetail.titleMidl=resJson.data.title
             this.fujianListDetail.contentNum=resJson.data.ComAttNumber
             this.ratList.contentNum=resJson.data.EvaluatNumber
             this.ratListDetail.contentNum=resJson.data.EvaluatNumber
             this.ratListDetail.SN=resJson.data.SN
             this.ratList2.contentNum=resJson.data.EvaluatNumber
             this.useList.contentNum=resJson.data.UseNumber
             this.useListDetail.contentNum=resJson.data.UseNumber
             this.attachmentList=resJson.data.ComAttList
             this.useData=resJson.data.useList
             this.ratDataList=resJson.data.EvaluatList
             this.myRatData.SN=resJson.data.SN
             this.newList=resJson.data.tjList    //相关推荐

            if(!resJson.data.isShowMore_Use){//控制应用是否出现进入详情
              this.useList.goNext=''
            }
            if(!resJson.data.isShowMore_ComAtt){//控制附件是否出现进入详情
               this.fujianList.goNext=''
            }
            if(!resJson.data.isShowMore_Evaluat){//控制评价是否出现进入详情
              this.ratList.goNext=''
            }
            this.ratDataList.forEach((item)=>{
              // item.OpDate=this.Test(item.OpDate)
              item.OpDate=this.formatDate(new Date(item.OpDate))
            })
            console.log('this.ratDataList',this.ratDataList)

          }else {
            if(resJson.msg.indexOf("登录")>=0){
              this.$confirm({
                type:'温馨提示',
                msg:resJson.msg,
                btn:{
                  ok:"ok",
                  no:'no'
                }
              })
                .then(()=>{
                    localStorage.setItem("JumpKey", window.location.href);
                    this.$router.push("/BS_cgkLogin")
                })
                .catch(()=>{
                  this.$router.go(-1)
                })
            }else {
              this.$confirm({
                type:'错误',
                msg:resJson.msg,
                btn:{
                  ok:"ok"
                }
              })
            }

          }
        },
        /*时间转换*/
        formatDate(dt) {
          let year = dt.getFullYear();
          let month = dt.getMonth() + 1;
          let date = dt.getDate();
          return year + "/" + month + "/" + date
        },
        Test(time) {
          let t= time.slice(6, 19);
          let NewDtime = new Date(parseInt(t));
          return this.formatDate(NewDtime);
        },
        def_getBack(){
            this.reload()
          },
        do_showDetail(item){
          // alert(item)
          window.scrollTo(0,0)
          switch (item){
            case "topButton":
                this.bigDataShow=false;
                this.adress="详情信息";
                this.adressDetail[0]=true
              break;
            case 'fujian':
              this.bigDataShow=false;
              this.adress="附件报告";
              this.adressDetail[1]=true
              this.do_getAllComAtt()

              break;
            case 'yingYong':
              this.bigDataShow=false;
              this.adress="应用情况";
              this.adressDetail[2]=true
              this.do_getAllUse()
              break;
            case "myRat":
              this.bigDataShow=false;
              this.adress="我要评价";
              this.adressDetail[3]=true;
              this.do_queryRat()   //获取贫家详细信息
              break;
            case "ratChange":
              this.bigDataShow=false;
              this.adress="交流互动";
              this.adressDetail[4]=true
              break;
            case "我要评价":
              this.$set(this.ratShow,0,true)
              break;
            case "我要提问":
              this.$set(this.ratShow,1,true)
              break;
          }
        },
        /*获取全部附件信息*/
        do_getAllComAtt(){
          let me = this;
          me.$ZcPublic.zcServer.Post({
            IsNeedLogin: 'true',
            Paras: {
              Name: 'Vue_resultLib',
              action: "getList_ResultShowShow_ComAtt",
              Data: {
                SN:me.SN,
              }
            },
            Callback: me.cb_getAllComAtt,
            Scope: me,
          });
        },
        cb_getAllComAtt(resJson,scope){
          console.log('全部附件',resJson)
          if(resJson.success){
            this.attachmentListDetail=resJson.data
          }
        },
        /*获取全部附件信息*/
        do_getAllUse(){
          let me = this;
          me.$ZcPublic.zcServer.Post({
            IsNeedLogin: 'false',
            Paras: {
              Name: 'Vue_resultLib',
              action: "getList_ResultShowShow_Use",
              Data: {
                SN:me.SN,
              }
            },
            Callback: me.cb_getAllUse,
            Scope: me,
          });
        },
        cb_getAllUse(resJson,scope){
          console.log('全部应用',resJson)
          if(resJson.success){
            this.useDataDetail=resJson.data
          }
        },
        /*查询评论信息*/
        do_queryRat(){
          let me = this;
          me.$ZcPublic.zcServer.Post({
            IsNeedLogin: 'false',
            Paras: {
              Name: 'Vue_resultLib',
              action: "getResultShowEvaluatByQuery",
              Data: {
                SN:me.SN,
                Page:me.ratPage,
                QueryStr:me.ratQueryStr
              }
            },
            Callback: me.cb_QueryRat,
            Scope: me,
          });
        },
        cb_QueryRat(resJson,scope){
          console.log('评价数据返回',resJson)
          if(resJson.success){
            this.ratPages=resJson.data.Pages
            this.ratDataList2=resJson.data.Data
            this.ratDataList2.forEach((item)=>{
              // item.OpDate=this.Test(item.OpDate)
              item.OpDate=this.formatDate(new Date(item.OpDate))
            })
          }else {
            this.$confirm({
              type:'错误',
              msg:resJson.msg,
              btn:{
                ok:'ok'
              }
            })
          }
        },
        /*选择成果上传模块*/
        do_selectNav(index){
          this.$refs.closeMore.def_close()
          window.scrollTo(0,240)
          this.upNavIndex=index
          this.selectNavData[index].first=true
        },
        /*下载*/
        do_downLoad(item){
          this.FileSN=item
          let me = this
          me.$ZcPublic.zcServer.Post({
            IsNeedLogin: 'false',
            Paras: {
              Name: 'Vue_resultLib',
              action: "doDownLoand_ResultShow",
              Data: {
                SN:me.SN
              }
            },
            Callback: me.cb_doDownLoand_ResultShow,
            Scope: me,
          });
        },
        cb_doDownLoand_ResultShow(resJson,scope){
          console.log('下载次数加1',resJson)
          if(resJson.success){
            let me = this
            me.$ZcPublic.zcServer.DownOss({  //下载
              Scope: me,
              FileSN: me.FileSN
            });
          }else {
            this.$confirm({
              type:'温馨提示',
              msg:resJson.msg,
              btn:{
                ok:'ok',
                no:'no'
              }
            })
              .then(()=>{
                localStorage.setItem("JumpKey", window.location.href);
                this.$router.push("/BS_cgkLogin")
              })
          }
        },
        /*全屏展示*/
        do_fullScreen(item){

          window.open( item, status="no")
        },
        do_query(item){
          this.ratQueryStr.QueryKeyModel=item.queryTarg
          this.ratQueryStr.QueryKey=item.queryText

          this.do_queryRat()
        },
        getCurPage(item){//分页组件传过来页数
          this.ratPage=item
          this.do_queryRat()
          window.scrollTo(0,0)
        }
      },
      computed:{
        getHomeData(){
          return this.$store.getters.getHomeData;
        },
      },
      mounted() {
        // console.log("getHomeData()",this.getHomeData)
        // this.newList.push(this.getHomeData.ResultShowLastList[0])
      }
    }
</script>

<style scoped>

.top-position{
  height: 40px;
  line-height: 40px;
}
.top-position span{
  color: #478FFC;
  cursor: pointer;
}
  .contentLeft{
    flex: 0 0 300px;
    margin-right: 10px;
    box-sizing: border-box;
  }
  .refreshWrapper{
    padding: 0 10px;
    border-bottom: 1px solid gainsboro;
  }
  .keywordList{
    padding: 0 10px;
  }
  .eyes-title{
    height: 50px;
    line-height: 50px;
    border-bottom: 1px solid gainsboro;
    align-items: center;
  }
  .eyes-title img{
    margin: 0 10px;
    width: 25px;
    height: 25px;
  }
.cgContent{
  min-height: 700px;
  max-height: 700px;
  padding:10px 20px;
  overflow: auto;
}
.pdtb10px{
  padding: 10px 0;
}
.upNav{
  color: #6D6D6D;
  margin-right: 38px;
  cursor: pointer;
}
.fullScreen{
  color: #6D6D6D;
  margin-right: 30px;
}
.fullScreen img{
  width: 14px;
  position: relative;
  right: 5px;
  top: -1px;
}
.icon-xiazai{
  color:#EF9D5A ;
  margin-right: 5px;
  font-weight: 600;
}
.xiazai-text{
  color:#EF9D5A ;
  cursor: pointer;
}
  .selectNav{
    height: 45px;
    line-height: 45px;
    box-sizing: border-box;
    border-bottom: 1px solid gainsboro;
    align-items: center;
    padding: 0 20px 0 20px;
  }
#currentNav{
  color:#418EFD ;
  position: relative;
  /*border-bottom: 2px solid #418EFD;*/
}
#currentNav:after{
  content: '';
  position: absolute;
  width: 100%;
  height: 2px;
  background-color:#418EFD ;
  bottom: 7px;
  left: 0;
}
.eyesWrapper img{
  width: 20px;
}
  .ratWrap{
    min-height: 500px !important;
  }
</style>
